<demo>复杂引用对话框</demo>
<template>
<div>
    <Button @click="toggle">打开对话框</Button>
    <Dialog v-model:visible='dialogVisible' :closeOnClickOverlay="false" :ok="sure" :cancel="quit">
        <template v-slot:title>
            <strong>标题</strong>
        </template>
        <template v-slot:content>
            <em>hello world</em>
        </template>
    </Dialog>
</div>
</template>

<script lang="ts">
import Button from '../lib/Button.vue'
import Dialog from '../lib/Dialog.vue'
import {
    ref,
    h
} from 'vue'
export default {
    components: {
        Dialog,
        Button
    },
    setup() {
        const dialogVisible = ref(false);
        const toggle = () => {
            dialogVisible.value = !dialogVisible.value;
        }
        const sure = () => {
            return true;
        }
        const quit = () => {}
        return {
            dialogVisible,
            toggle,
            sure,
            quit,
        };
    }
}
</script>
